<!-- 首页 -->
<template>
  <div class="home">
    <!-- 走马灯 -->
    <el-carousel trigger="click" height="570px">
      <el-carousel-item v-for="item in 7" :key="item">
        <img :src="require(`@/assets/home/${item}.jpg`)" alt="" width="1536px" />
      </el-carousel-item>
    </el-carousel>

    <!-- 中间内容 -->
    <div class="content">内容</div>
  </div>
</template>

<script>
  import { axios_home } from '@/api/data_axios'
  export default {
    data() {
      return {}
    },
    mounted() {
      // window.addEventListener('scroll', this.handleScroll) //监听滚动事件
      axios_home().then((res) => {
        console.log(res)
      })
    },
    beforeDestroy() {
      // window.removeEventListener('scroll', this.handleScroll)
    },
    methods: {
      // handleScroll() {
      //   this.currentScroll = window.pageYOffset //表示当前滚动的位置
      //   if (this.currentScroll >= this.$refs.course.offsetTop - 525) {
      //     this.centerul = true
      //     this.showcourse = true
      //   }
      //   if (this.currentScroll >= this.$refs.only.offsetTop - 470) {
      //     this.only = true
      //     this.showonly = true
      //   }
      //   if (this.currentScroll >= this.$refs.only.offsetTop - 137) {
      //     this.only2 = true
      //     this.showonly2 = true
      //   }
      // },
    },
  }
</script>

<style lang="scss" scoped>
  .home {
    .content {
      height: 800px;
    }
  }
</style>
